<template>
<div>
	<a-row :gutter="16">
	  <a-col :span="16">
			<a-card  :title="re.title">
				<div slot="extra">
					<a-button type="primary" icon="file" @click="visible=true" :disabled="!canApply">
					  投递简历
					</a-button>
				</div>
			   <a-card-meta :title="re.creater.name" :description="formatTime(re.updateTime)">
					<a-avatar slot="avatar" :src="re.creater?.avatar ? re.creater.avatar : null | avatar" />
				</a-card-meta>
				 <template slot="actions" class="ant-card-actions">
					  <span>岗位：{{re.job}}</span>
					   <span>人数：{{re.nums}}</span>
						<span>薪资：{{re.salary}}</span>
						 <span>截至日期：{{formatTime2(re.endDate)}}</span>
				 </template>
				<div class="html" v-html="handleContent()">
					
				</div>

			</a-card>
	  </a-col>
	  <a-col :span="8">
		    <a-card title="企业信息">
		      <p>企业名称：{{re.creater.company.name}}</p>
		      <p>企业官网：{{re.creater.company.website}}</p>
		      <p>企业性质：{{re.creater.company.type}}</p>
			  <p>所属行业：{{re.creater.company.industry}}</p>
			  <p>员工数量：{{re.creater.company.workers}}</p>
			  <p>简介：{{re.creater.company.desp}}</p>
		    </a-card>
	  </a-col>
	</a-row>

	
	  <a-modal v-model="visible" title="投递简历" @ok="handleOk">
		<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
		    <a-form-item label="简历" required>
			  <a-select v-decorator="['resume', { rules: [{ required: true, message: '请选择简历' }] }]">
			        <a-select-option  v-for="item in resumes" :key="item.id" :value="item.id">
			          {{item.name}}
			        </a-select-option>
			 </a-select>
		    </a-form-item>
		</a-form>
	  </a-modal>
</div>
		
</template>
<script>
import {findRecruit} from '@/api/recruit'
import {findResumes} from '@/api/resume'
import {edit, findMyApply} from '@/api/apply'
import moment from 'moment'
import {marked} from 'marked'
import storage from 'store'
import { LOGIN_ID } from '@/store/mutation-types'

export default {
	name: 'RecruitDetail',
	data(){
		return {
			re: {},
			resumes: [],
			visible: false,
			canApply: true,
			form: this.$form.createForm(this),
		}
	},
	created(){
		// 不是学生不能投递
		if(this.$store.getters.roles[0] != "student"){
			this.canApply = false
		}

		findRecruit(this.$route.params.id).then(res => {
			this.re = res.data
			if(this.re.endDate){ // 招聘已过截至日期，不能投递
				const end = moment(this.re.endDate).format('YYYY-MM-DD')
				const current = moment(new Date()).format('YYYY-MM-DD')
				if(moment(end).isBefore(current,'day')){
					this.canApply = false
				}
			}
		}).catch(err => {
			
		})
		
		// 我的简历列表
		findResumes(storage.get(LOGIN_ID)).then(res => {
			this.resumes = res.data
		}).catch(err => {
			
		})
		
		
		// 查找到我的申请记录，不萌再投递
		findMyApply(storage.get(LOGIN_ID), this.$route.params.id).then(res => {
			if(res.data.length > 0){
				this.canApply = false
			}
		}).catch(err => {
			
		})

	},
  filters: {
	avatar(name){
		if (name != null){
			return "http://localhost:8080/static/" + name
		}else{
			return "https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png"
		}
		
	}
  },
	methods: {
		formatTime(time){
		  return moment(time).format('YYYY-MM-DD HH:mm:ss')
		},
		formatTime2(time){
		  return moment(time).format('YYYY-MM-DD')
		},
		handleContent(){
			return  marked.parse(this.re.content)
		},
		handleOk(){
			const { form: { validateFields }} = this
			validateFields({ force: true }, (err, values) => {
			console.log(values)
			  if (!err) {
				  const data = {
					  resume:{
						  id: values.resume
					  },
					  recruit: {
						  id: this.re.id
					  }
				  }
				  edit(data).then(res =>{
					    if(res.code == 200){
					  	 this.$notification['success']({
					  	   message: '成功',
					  	   description: '投递成功',
					  	   duration: 4
					  	 })
						 this.visible = false
						 this.canApply = false
					   }else{
					  	 this.$notification['error']({
					  	   message: '错误',
					  	   description: res.msg,
					  	   duration: 4
					  	 })
					 }
				  }).catch(err => {
					  this.$notification['error']({
					    message: '错误',
					    description: err,
					    duration: 4
					  })
				  })
			  }
			})
		}
	}
}
</script>
<style scoped>
	.html {
		padding-top: 20px;
	}
</style>